<template>
  <tr>
    <td>
      <input type="checkbox" v-model="arr.ischeck" />
    </td>
    <td>{{arr.name}}</td>
    <td>{{arr.price}}</td>
    <td>
      <button @click="jian">-</button>
      {{num}}
      <button @click="add">+</button>
    </td>
    <td>{{arr.totalprice}}</td>
    <td>
      <button @click="del">删除</button>
    </td>
  </tr>
</template>
<script>
export default {
  props: ["arr"],
  data() {
    return {
      num: 0
    };
  },
  methods: {
    jian() {
      if (this.num === 0) {
        return;
      } else {
        this.num--;
      }
    },
    add() {
      this.num++;
    },
    del() {
      this.$emit("delet", this.arr.id);
    }
  },
  computed: {},
  watch: {
    arr: {
      handler(newval) {
        // console.log(newval);
        this.$emit("returnItem", newval);
      },
      deep: true
    },
    num(newval) {
      this.arr.totalprice = this.arr.price * newval;
    }
  },
  created() {},
  mounted() {}
};
</script>

<style scoped>
</style>